<script setup>
import { ref } from 'vue';
import request from '../axios/axios.js'

let inputUserId=ref("");
let inputUserName=ref("");


//用户管理员通过用户id删除
async function adminDeleteUserId(){
    let {data} = await request.get("/adminDeleteUserInfoByUserId",{
        params:{
            userId:inputUserId.value
        }
    })

    if(data.statusCode==200){
        alert(data.message);
    }else{
        alert(data.message);
    }
}
//用户管理员通过用户名删除 
async function adminDeleteUserName(){


    let {data} = await request.get("/adminDeleteUserInfoByUserName",{
        params:{
            userName:inputUserName.value
        }
    })

    if(data.statusCode==200){
        alert(data.message);
    }else{
        alert(data.message);
    }
}
</script>

<template>
    管理员用户管理界面
    删除界面

    <table style="width: 100%; height: 100%;">     

        <tr class="trb">
            <td class="name">通过用户ID</td ><td class="content"  > <input type="text"   v-model="inputUserId" /></td><td><button @click="adminDeleteUserId()">删除</button></td>
        </tr>
        <tr class="trb">
            <td class="name">通过用户名字</td ><td class="content"  > <input type="text"  v-model="inputUserName" /></td><td><button @click="adminDeleteUserName()">删除</button></td>
        </tr>

        
    </table>

</template> 

<style scoped>

.name{   
      width: 20%;
   }
   .trb{
      background-color: beige;
      height: 10%;
   }
   .tb_content{
      width: 100%;
      height: 100%;
      background-color: rgb(238, 245, 205);
      /* background-image: url(../public/img/bg02.jpg);
      background-size: 100%; */
   }
   .trb:hover{
      background-color: chartreuse;
   }
   .trb:active{
      background-color:rgb(230, 26, 26);
   }
   /*
        用户查询
   */
   .Despoit{
    width: 100%;
    height: 80%;
    background-color: chocolate;
   }


   /* 
    寝室信息展示
   */
   .Dormitory{
    width: 100%;
    height: 20%;

   }
   .showQuery{
    width: 100%;
    height: 100%;

   }
   .DormitoryName{
    width: 100%;
    height: 20%;

   }
</style>
